<template>
	<view>
		<!-- pages/user_payment/user_payment.wxml -->
		<view class="user-payment">
			<view class="fast-payment-container">
				<view class="title bold normal row">{{userInfo.partner_level == 1?'购买冰箱':'升级合伙人'}}</view>
				<view class="fast-pay row wrap">
					<view :style="{backgroundColor:activate?'#FF2C3C':'#FFFFFF',color:activate?'#FFFFFF':'#FF2C3C'}" v-for="(item, index) in rechargeObj" :key="index" class="fast-pay-item bg-white column-center"
						@tap="temRecharge(item)">
						<view class="price primary bold" >
							<price-format weight="500" :firstSize="42" :secondSize="42"
								:price="item.amount_value" :style="{color:activate?'#FFFFFF':'#808080'}"></price-format>
							<text class="xxl" style="font-weight: 500" :style="{color:activate?'#FFFFFF':'#808080'}">元</text>
						</view>
						<view class="preferential primary xs" :style="{color:activate?'#FFFFFF':'#808080'}">{{item.name}}</view>
					</view>
				</view>
			</view>
			<view class="pay-way contain">
				<view class="lighter title">支付方式</view>
				<radio-group class="radio-group" @change="radioChange">
					<label v-for="(item, index) in payWayArr" :key="index" class="item row-between">
						<view class="row">
							<image class="icon-lg mr20" :src="item.icon"></image>
							<view class>
								<view class="balck bt10">{{item.name}}</view>
								<view class="muted xs">{{item.extra}}</view>
							</view>
						</view>
						<radio class="radio" :value="String(item.pay_way)" :checked="item.pay_way == payWay"></radio>
					</label>
				</radio-group>
			</view>
			
			<view class="agreement mb20">
				<u-checkbox v-model="agreement" size="36" active-color="#FF2C3C" shape="circle"></u-checkbox>
				<view class="sm row">
					已阅读并同意
					<navigator class="primary" hover-class="none" url="/pages/bundle/server_explan/server_explan?type=3">《升级合伙人合同协议》</navigator>
				</view>
			</view>
			
			<button size="lg" class="btn white br60" @tap="SubmitEvent">
				{{userInfo.partner_level == 1?'购买冰箱':'立即升级'}}
			</button>
		</view>
		<loading-view id="van-toast" v-if="showLoading" backgroundColor="rgba(0, 0, 0, 0)"></loading-view>
	</view>
</template>

<script>
	// +----------------------------------------------------------------------
	// | likeshop100%开源免费商用商城系统
	// +----------------------------------------------------------------------
	// | 欢迎阅读学习系统程序代码，建议反馈是我们前进的动力
	// | 开源版本可自由商用，可去除界面版权logo
	// | 商业版本务必购买商业授权，以免引起法律纠纷
	// | 禁止对系统程序代码以任何目的，任何形式的再发布
	// | gitee下载：https://gitee.com/likeshop_gitee
	// | github下载：https://github.com/likeshop-github
	// | 访问官网：https://www.likeshop.cn
	// | 访问社区：https://home.likeshop.cn
	// | 访问手册：http://doc.likeshop.cn
	// | 微信公众号：likeshop技术社区
	// | likeshop团队 版权所有 拥有最终解释权
	// +----------------------------------------------------------------------
	// | author: likeshopTeam
	// +----------------------------------------------------------------------

	import {
		partnerTemplate,
		partnerBuy,
		freezerBuy,
		paymentPrepay
	} from '@/api/common.js';
	import {
		getUser
	} from '@/api/user.js';
	import {
		client
	} from '@/utils/tools'
	import {
		prepay,
		getPayway
	} from '@/api/app';
	import {
		wxpay,
		alipay
	} from '@/utils/pay';

	export default {
		data() {
			return {
				rechargeObj: [], //合伙人等级
				payWayArr: [], //支付方式列表
				partner_id: 0, //合伙人等级id
				payWay: 0, //支付方式
				userInfo: {}, //用户信息
				showLoading: false,
				payStatus: false,
				activate:false,
				type:'',
				agreement:false,
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			this.getPaywayFun()
			this.rechargeTemplateFun();
			this.getUserInfoFun();
		},
		methods: {
			// 获取支付配置
			getPaywayFun() {
				return new Promise(resolve => {
					getPayway().then(res => {
						if (res.code == 1) {
							this.payWayArr = res.data
							this.payWay = res.data.length ? res.data[0].pay_way : 0
							resolve()
						}
					})
				})
			},
			// 选择支付方式
			radioChange(e) {
				this.payWay = Number(e.detail.value)
			},
			// 获取用户信息
			getUserInfoFun() {
				getUser().then(res => {
					if (res.code == 1) {
						this.userInfo = res.data
					}
				});
			},
			//合伙人等级
			rechargeTemplateFun() {
				partnerTemplate().then(res => {
					if (res.code == 1) {
						this.rechargeObj = res.data
					}
				});
			},
			//立即升级
			SubmitEvent() {
				if(!this.agreement) return this.$toast({title: '请阅读并勾选升级合伙人合同协议'})
				if (this.partner_id <= 0 || !this.activate) return this.$toast({title: '请选择业务类型'})
				if(this.type == 'freezer'){
					uni.showModal({
						title: '温馨提示',
						content: '是否确认购买?',
						confirmColor: '#FF2C3C',
						success: async res => {
							let {
								confirm
							} = res;
							if (confirm) {
								this.rechargeFreezerBuy()
							}
						}
					});
				}else{
					uni.showModal({
						title: '温馨提示',
						content: '是否确认升级?',
						confirmColor: '#FF2C3C',
						success: async res => {
							let {
								confirm
							} = res;
							if (confirm) {
								this.rechargePartnerBuy()
							}
						}
					});
				}
				
			},
			rechargeFreezerBuy() {
				let that = this;
				this.showLoading = true
				freezerBuy({
					id: that.partner_id,
					pay_way: that.payWay,
					type:that.type,
					action: 'submit'
				}).then(res => {
					this.showLoading = false
					if (res.code == 1) {
						let {
							order_id,
							type
						} = res.data;
						this.paymentPrepay(order_id, type)
					}
				})
			},
			rechargePartnerBuy() {
				let that = this;
				this.showLoading = true
				partnerBuy({
					id: that.partner_id,
					pay_way: that.payWay,
					type:that.type,
					action: 'submit'
				}).then(res => {
					this.showLoading = false
					if (res.code == 1) {
						let {
							order_id,
							type
						} = res.data;
						this.paymentPrepay(order_id, type)
					}
				})
			},

			temRecharge(e) {
				this.activate = !this.activate;
				this.partner_id = e.id;
				this.type = e.type;
			},
			paymentPrepay(order_id, type) {
				this.showLoading = true;
				if (!this.payWayArr.length) {
					this.showLoading = false
					return this.$toast({
						title: '请联系管理员配置支付方式'
					})
				}
				paymentPrepay({
					order_id: order_id,
					from: type,
					order_source: client
				}).then(res => {
					this.showLoading = false
					if (res.code == 1) {
						let prepayData = res.data;
						//微信成功
						wxpay(prepayData).then((res) => {
							if (res == 'success') {
								this.payStatus = true;
								uni.redirectTo({
									url: `/pages/partner_result/partner_result?id=${order_id}&type=${type}`
								});
							}
						})
					} else if (res.code == 20001) {
						let prepayData = res.data;
						//支付宝成功
						alipay(prepayData).then((res) => {
							if (res == 'success') {
								this.payStatus = true;
								uni.redirectTo({
									url: `/pages/partner_result/partner_result?id=${order_id}&type=${type}`
								});
							}
						})
					} else if (res.code == 10001) {
						//余额支付成功
						uni.redirectTo({
							url: `/pages/partner_result/partner_result?id=${order_id}&type=${type}`
						});
					}
				})
			}
		}
	};
</script>
<style lang="scss">
	/* pages/user_payment/user_payment.wxss */
	.user-payment {
		padding: 20rpx 30rpx;
		.pay-way {
			.title {
				padding: 20rpx 24rpx;
			}

			.radio-group .item {
				height: 120rpx;
				padding: 0 24rpx;
			}
		}
		.agreement{
			display: flex;
			justify-content: flex-start;
			align-items: center;
		}
		.payment {
			text-align: center;
			border-radius: 20rpx;
			overflow: hidden;
			padding-bottom: 74rpx;

			.nav {
				margin: 20rpx 95rpx 80rpx;

				.item {
					flex: 1;

					.line {
						width: 110rpx;
						height: 2px;
					}
				}
			}

			.line {
				width: 110rpx;
				height: 2px;
			}

			.input {
				margin-left: 66rpx;
				margin-top: 35rpx;
				margin-right: 30rpx;

				input {
					height: 94rpx;
					text-align: left;
					font-size: 66rpx;
					margin-left: 30rpx;
				}

				border-bottom: $-solid-border;
			}

			.tip {
				margin: 25rpx 66rpx;
			}

		}

		.btn {
			background: linear-gradient(79deg, rgba(249, 95, 47, 1) 0%, rgba(255, 44, 60, 1) 100%);
			margin: 70rpx 0 30rpx;
		}

		.fast-payment-container {
			margin-top: 72rpx;

			.title {
				font-size: 38rpx;
				line-height: 53rpx;
			}

			.fast-pay {
				margin-top: 40rpx;

				.fast-pay-item {
					position: relative;
					width: 214rpx;
					height: 150rpx;
					border-radius: 10rpx;
					margin-bottom: 16rpx;
					border: 1px solid #808080;

					&:not(:nth-of-type(3n)) {
						margin-right: 24rpx;
					}

					.hot-recharge {
						position: absolute;
						padding: 2rpx 10rpx;
						background: linear-gradient(180deg, #FF2C3C 0%, #F95F2F 100%);
						border-radius: 0 10rpx 0 10rpx;
						font-size: 20rpx;
						top: 0;
						right: 0;
					}

					.price {
						font-size: 42rpx;
						line-height: 50rpx;
					}

					.preferential {
						line-height: 32rpx;
					}
				}

			}
		}
	}

	.pay-popup {
		.content {
			padding: 40rpx 0;
			text-align: center;
			width: 560rpx;
			border-radius: 20rpx;
		}

		.img-icon {
			width: 168rpx;
			height: 118rpx;
			display: inline-block;
		}

		.btn {
			margin: 80rpx 60rpx 0;
		}
	}
</style>